<template>
  <div class="app-container">
    <div style="margin-top:20px">
      <el-table
        :data="list"
        border
        style="width: 100%"
      >
        <el-table-column label="序号">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column label="平台名称">
          <template slot-scope="scope">
            {{ scope.row.platformName }}
          </template>
        </el-table-column>
        <el-table-column label="平台标识">
          <template slot-scope="scope">
            {{ scope.row.platformMark }}
          </template>
        </el-table-column>
        <el-table-column label="操作" width="400">
          <template slot-scope="scope">
            <el-button
              v-powerbtn="{power: 'usercenter-point-action'}"
              type="primary"
              plain
              size="mini"
              round
              @click="editaction(scope.row.platformId)"
            >动作管理</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination-container">
        <el-pagination
          :current-page.sync="pageid"
          :page-sizes="[20,50,100]"
          :page-size="pagecount"
          :total="count"
          background
          highlight-current-row
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </div>
    <!-- <action-manage :point-dialog="pointDialog" @closePoint="closePoint" /> -->
  </div>
</template>
<script>
import { getList } from '@/api/platformManage'
import secret from '@/utils/secret'
import { mapGetters } from 'vuex'
import actionManage from './components/actionManage.vue'
import powerbtn from '@/directive/powerbtn/index.js'
export default {
  name: 'PointChange',
  directives: {
    powerbtn
  },
  components: {
    actionManage: actionManage
  },
  data() {
    return {
      list: null,
      pageid: 1, // 当前页数
      pagecount: 20, // 每页显示条数
      count: 0, // 总数量
      pages: null, // 总页数
      pointDialog: false, // 遮罩
      powerBtn: null, // 权限
      userManage_add: false, // 新增
      userManage_edit: false, // 编辑
      userManage_dele: false, // 删除
      flag: true,
      newPower: null, // 动作管理权限,
      powerExitBtn: null, // 按钮权限
      lastPower: null, // 最终处理结果
      pagesNums: 0
    }
  },
  computed: {
    ...mapGetters(['assignment', 'token'])
  },
  mounted() {
    this.loadList(1)
    this.dialogTableVisible = false
    // var that = this
    // console.log(this.assignment)
    // this.assignment.forEach(function(item) {
    //   if (item.menuCode === 'integralTrigger') {
    //     that.power = item.btnList
    //   }
    // })
    // var power = Array(this.list.length).fill(false)
    // console.log(power)
    // 按钮权限
    // this.power.forEach(function(item) {
    //   if (item.code.indexOf(''))
    // })
  },
  methods: {
    // 请求数据列表
    loadList(num) {
      var data = {
        // token: this.token,
        pageid: num,
        pagecount: this.pagecount
      }
      console.log('请求参数')
      console.log(data)
      getList(secret.Encrypt(data)).then(response => {
        console.log('返回数据')
        console.log(response)
        this.list = response.data.list // 列表项
        this.count = parseInt(response.data.count) // 总数量
        console.log(response.data)
        this.powerful(this.list.length, this.list)
      }).catch(() => {
        this.$message({
          message: '请求列表失败，请重试',
          type: 'error'
        })
      })
    },
    // 权限按钮
    powerful(len, data) {
      var power = Array(len).fill(false)
      var arr = []
      var arrListPower = []
      var arrPowerBtn = []
      console.log(this.assignment)
      this.assignment.forEach(function(item) {
        if (!!item) { // eslint-disable-line
          if (item.menuCode === 'integralTrigger') {
            item.btnList.forEach(function(index) {
              if (!!index) { // eslint-disable-line
                arr.push(index.code)
              }
            })
          }
        }
      })
      console.log(arr)
      arr.forEach(function(item) {
        if (!!item){ // eslint-disable-line
          // 平台权限和按钮权限分开
          if (item.indexOf('integralTrigger') >= 0) {
            arrListPower.push(item)
            // console.log(item)
          }
          if (item.indexOf('behaviorManage') >= 0) {
            arrPowerBtn.push(item)
          }
        }
      })
      this.powerBtn = arrListPower.map(function(item) {
        return item.replace('integralTrigger_', '')
      }) // 动作管理权限
      console.log(this.powerBtn) // 得到的权限数组
      this.powerExitBtn = arrPowerBtn.map(function(item) { // 得到的btn按钮权限
        return item.replace('behaviorManage_', '')
      })
      console.log(this.powerExitBtn)
      var power1 = []
      // 列表项
      data.forEach(function(item) {
        if (!!item) { // eslint-disable-line
          power1.push(item.platformId)
        }
      })
      console.log(power1)
      for (var i = 0; i < power1.length; i++) {
        for (var j = 0; j < this.powerBtn.length; j++) {
          if (this.powerBtn[j] === power1[i]) {
            // console.log(this.powerBtn[j] + i)
            power[i] = true
          }
        }
      }
      console.log(power)
      this.lastPower = power
    },
    // 当前页面改变时
    handleSizeChange(num) {
      this.flag = false
      this.pagecount = num
      console.log(num)
      const data = {
        // token: this.token,
        pageid: 1,
        pagecount: parseInt(num)
      }
      console.log('请求参数')
      console.log(data)
      getList(secret.Encrypt(data)).then(response => {
        this.flag = true
        console.log('返回数据')
        console.log(response)
        this.pageid = 1
        this.list = response.data.list // 列表项
        this.count = parseInt(response.data.count) // 总数量
        this.powerful(this.list.length, this.list)
        console.log(response.data)
      }).catch(() => {
        this.$message({
          message: '请求列表失败，请重试',
          type: 'error'
        })
      })
    },
    // 跳转某页
    handleCurrentChange(num) {
      const data = {
        // token: this.token,
        pageid: num,
        pagecount: this.pagecount
      }
      console.log('请求参数')
      console.log(data)
      // if (this.flag === true) {
      getList(secret.Encrypt(data)).then(response => {
        console.log('返回数据')
        console.log(response)
        this.pagesNums = (num - 1) * 10
        this.list = response.data.list // 列表项
        this.count = parseInt(response.data.count) // 总数量
        this.pageid = num // 当前页数
        this.powerful(this.list.length, this.list)
        console.log(response.data)
      }).catch(() => {
        this.$message({
          message: '请求列表失败，请重试',
          type: 'error'
        })
      })
      // }
    },
    // 动作管理
    editaction(code) {
      var btnpower = JSON.stringify(this.powerExitBtn)
      this.$router.push({
        path: `/actionManage/index/${code}/${btnpower}`
      })
    }
    // // 遮罩子组件回调
    // closePoint() {
    //   this.pointDialog = false
    //   this.addScope = false
    //   this.handleCurrentChange(this.pageid)
    // }
  }
}
</script>
<style scoped>

</style>
